<script setup>

</script>

<template>
<h1>轮播图组件</h1>
  <el-carousel style="width: 380px; margin: 0 auto;">
    <el-carousel-item>
      <img src="carousel1.jpg" style="width: 100%;height: 100%;">
    </el-carousel-item>
    <el-carousel-item>
      <img src="carousel2.jpg" style="width: 100%;height: 100%;">
    </el-carousel-item>
    <el-carousel-item>
      <img src="carousel3.jpg" style="width: 100%;height: 100%;">
    </el-carousel-item>
    <el-carousel-item>
      <img src="carousel4.jpg" style="width: 100%;height: 100%;">
    </el-carousel-item>
  </el-carousel>

  <el-carousel style="width: 380px; margin: 0 auto;" trigger="click">
    <el-carousel-item>
      <img src="carousel1.jpg" style="width: 100%;height: 100%;">
    </el-carousel-item>
    <el-carousel-item>
      <img src="carousel2.jpg" style="width: 100%;height: 100%;">
    </el-carousel-item>
    <el-carousel-item>
      <img src="carousel3.jpg" style="width: 100%;height: 100%;">
    </el-carousel-item>
    <el-carousel-item>
      <img src="carousel4.jpg" style="width: 100%;height: 100%;">
    </el-carousel-item>
  </el-carousel>

  <el-carousel style="width: 900px; margin: 0 auto;" type="card">
    <el-carousel-item>
      <img src="carousel1.jpg" style="width: 100%;height: 100%;">
    </el-carousel-item>
    <el-carousel-item>
      <img src="carousel2.jpg" style="width: 100%;height: 100%;">
    </el-carousel-item>
    <el-carousel-item>
      <img src="carousel3.jpg" style="width: 100%;height: 100%;">
    </el-carousel-item>
    <el-carousel-item>
      <img src="carousel4.jpg" style="width: 100%;height: 100%;">
    </el-carousel-item>
  </el-carousel>
</template>

<style scoped>

</style>